import React , {Children, FC} from "react";
import classNames from "classnames";
import { FontAwesomeIcon , FontAwesomeIconProps } from '@fortawesome/react-fontawesome';

export type ThemeProps = 'primary' | 'secondary' | 'success' | 'info' | 'warning' | 'danger' | 'dark' | 'light';

export interface IconProps extends FontAwesomeIconProps {
    theme? : ThemeProps
};


const Icon: React.FC<IconProps> = (props)=>{
    const { children , className , theme , ...resetProps } = props;
    
    const classes = classNames('icon', className, {
        [`icon-${theme}`] : theme
    });

    return <div className={classes}>
        {children}
    </div>;

};

Icon.displayName = 'Icon';

export default Icon;